import React from 'react';
import { Card, Form, Select, Radio, Space, Button } from 'antd';

const { Option } = Select;

const FilterBar: React.FC = () => {
  return (
    <Card style={{ background: '#232733', color: '#fff', marginBottom: 16 }} bordered={false}>
      <Form layout="inline">
        <Form.Item label={<span style={{ color: '#fff' }}>模型类型</span>}>
          <Select defaultValue="all" style={{ width: 120 }}>
            <Option value="all">全部</Option>
            <Option value="llm">大语言模型</Option>
            <Option value="cv">计算机视觉</Option>
            <Option value="gen">生成式AI</Option>
          </Select>
        </Form.Item>
        <Form.Item label={<span style={{ color: '#fff' }}>发布时间</span>}>
          <Radio.Group defaultValue="all">
            <Radio.Button value="all">全部</Radio.Button>
            <Radio.Button value="week">近一周</Radio.Button>
            <Radio.Button value="month">近一月</Radio.Button>
          </Radio.Group>
        </Form.Item>
        <Form.Item label={<span style={{ color: '#fff' }}>热度</span>}>
          <Select defaultValue="all" style={{ width: 100 }}>
            <Option value="all">全部</Option>
            <Option value="hot">最热</Option>
            <Option value="new">最新</Option>
          </Select>
        </Form.Item>
        <Form.Item>
          <Space>
            <Button type="primary">筛选</Button>
            <Button>重置</Button>
          </Space>
        </Form.Item>
      </Form>
    </Card>
  );
};

export default FilterBar; 